<template>
	<scroll-view scroll-y="true" class="content">
		<!-- 标题部分 -->
		<view class="login_from_input">
			<view class="form-left">公司名称<span>*</span></view>
			<view class="login_from_fun"><input type="text" style="color: darkgray;" v-model="formData.company" disabled="true" placeholder="请输入需求名称"></view>
		</view>
		<view class="login_from_input">
			<view class="form-left">信息安全</view>
			<view class="login_from_fun">
				<picker style="width: 100%;" @change="levelChange" :value="levelIndex" :range-key="'dictLabel'"
					:range="levelArray">
					<view style="font-size: 28rpx; float:left;" class="uni-input">
						{{levelArray[levelIndex].dictLabel || '请选择'}}
					</view>
				</picker>
			</view>
		</view>
		<view class="login_from_input">
			<view class="form-left">需求标题<span>*</span></view>
			<view class="login_from_fun"><input type="text" v-model="formData.post" placeholder="请输入需求名称"></view>
		</view>
		<view class="login_from_input">
			<view class="form-left">行业领域<span>*</span></view>
			<view class="login_from_fun">
				<picker style="width: 100%;" @change="industryChange" :value="industryIndex" :range-key="'dictLabel'"
					:range="industryArray">
					<view style="font-size: 28rpx; float:left;" class="uni-input">
						{{industryArray[industryIndex].dictLabel || '请选择行业领域'}}
					</view>
				</picker>
			</view>
		</view>
		<view class="login_from_input">
			<view class="form-left">专业方向</view>
			<view class="login_from_fun">
				<input type="text" v-model="formData.zyfx" placeholder="请输入专业方向">
			</view>
		</view>
		<view class="login_from_input">
			<view class="form-left">服务形式</view>
			<view class="login_from_fun">
				<picker style="width: 100%;" @change="servicetypeChange" :value="servicetypeIndex"
					:range-key="'dictLabel'" :range="servicetypeArray">
					<view style="font-size: 28rpx; float:left;" class="uni-input">
						{{servicetypeArray[servicetypeIndex].dictLabel || '请选择服务形式'}}
					</view>
				</picker>
			</view>
		</view>
		<view class="login_from_input">
			<view class="form-left">工作经验<span>*</span></view>
			<view class="login_from_fun">
				<picker style="width: 100%;" @change="workyearChange" :value="workyearIndex" :range-key="'dictLabel'"
					:range="workyearArray">
					<view style="font-size: 28rpx; float:left;" class="uni-input">
						{{workyearArray[workyearIndex].dictLabel || '请选择工作经验'}}
					</view>
				</picker>
			</view>
		</view>
		<view class="login_from_input">
			<view class="form-left">学历<span>*</span></view>
			<view class="login_from_fun">
				<input type="text" v-model="formData.education" placeholder="请输入学历">
			</view>
		</view>
		<view class="login_from_input">
			<view class="form-left">学位</view>
			<view class="login_from_fun">
				<input type="text" v-model="formData.xw" placeholder="请输入学位">
			</view>
		</view>
		<view class="login_from_input">
			<view class="form-left">薪资报酬(元)/月<span>*</span></view>
			<view class="login_from_fun">
				<picker style="width: 100%;" @change="moneyChange" :value="moneyIndex" :range-key="'dictLabel'"
					:range="moneyArray">
					<view style="font-size: 28rpx; float:left;" class="uni-input">
						{{moneyArray[moneyIndex].dictLabel || '请选择薪资报酬'}}
					</view>
				</picker>
			</view>
		</view>
		<view class="login_from_input">
			<view class="form-left">需求有效时间</view>
			<view class="login_from_fun">
				<picker style="width: 100%;" @change="timelimitChange" :value="timelimitIndex" :range-key="'dictLabel'"
					:range="timelimitArray">
					<view style="font-size: 28rpx; float:left;" class="uni-input">
						{{timelimitArray[timelimitIndex].dictLabel || '请选择有效期'}}
					</view>
				</picker>
			</view>
		</view>
		<view class="login_from_input">
			<view class="form-left">职称要求</view>
			<view class="login_from_fun">
				<!-- <input type="text" style="height: 400rpx;  white-space:normal; word-break:break-all; word-warp:break-word;" v-model="formData.description" placeholder="请输入需求描述"> -->
				<input type="text" v-model="formData.zc" placeholder="请输入职称要求">
			</view>
		</view>
		<view class="login_from_input">
			<view class="form-left">联系人员<span>*</span></view>
			<view class="login_from_fun">
				<!-- <input type="text" style="height: 400rpx;  white-space:normal; word-break:break-all; word-warp:break-word;" v-model="formData.description" placeholder="请输入需求描述"> -->
				<input type="text" v-model="formData.lxr" placeholder="请输入联系人">
			</view>
		</view>
		<view class="login_from_input">
			<view class="form-left">联系电话<span>*</span></view>
			<view class="login_from_fun">
				<!-- <input type="text" style="height: 400rpx;  white-space:normal; word-break:break-all; word-warp:break-word;" v-model="formData.description" placeholder="请输入需求描述"> -->
				<input type="text" v-model="formData.phone" placeholder="请输入联系电话">
			</view>
		</view>
		<view class="login_from_input">
			<view class="form-left">工作地点<span>*</span></view>
			<view class="login_from_fun">
				<!-- <input type="text" style="height: 400rpx;  white-space:normal; word-break:break-all; word-warp:break-word;" v-model="formData.description" placeholder="请输入需求描述"> -->
				<input type="text" v-model="formData.workPlace" placeholder="请输入工作地点">
			</view>
		</view>
		<view class="login_from_input">
			<view class="form-left">职位介绍<span>*</span></view>
			<view class="login_from_fun">
				<!-- <input type="text" style="height: 400rpx;  white-space:normal; word-break:break-all; word-warp:break-word;" v-model="formData.description" placeholder="请输入需求描述"> -->
				<textarea v-model="formData.companyNum" placeholder="请输入职位介绍"></textarea>
			</view>
		</view>
		<view class="login_from_input">
			<view class="form-left">需求描述<span>*</span></view>
			<view class="login_from_fun">
				<!-- <input type="text" style="height: 400rpx;  white-space:normal; word-break:break-all; word-warp:break-word;" v-model="formData.description" placeholder="请输入需求描述"> -->
				<textarea v-model="formData.postInfo" placeholder="请输入需求详细描述"></textarea>
			</view>
		</view>
		<view class="uni-form-item">
			<view style="margin-bottom: 35rpx;background-color: #fff;">
				<button type="primary" @click="submitNeeds()">提交</button>
			</view>
		</view>
		<uni-popup v-if="canlendarShow">
			<tmt-calendar defaultDate="2021-11-03" :point-list="['2022-03-20','2022-04-01','2022-04-02','2022-04-05']"
				show="canlendarShow" @changeDate="changeDate(e)"></tmt-calendar>
		</uni-popup>
	</scroll-view>
</template>

<script>
	import * as mydata from '@/api/system/dict/data.js'
	import * as needs from '@/api/personCenter/NEED'

	function getDate(type) {
		const date = new Date();

		let year = date.getFullYear();
		let month = date.getMonth() + 1;
		let day = date.getDate();

		if (type === 'start') {
			year = year - 10;
		} else if (type === 'end') {
			year = year + 10;
		}
		month = month > 9 ? month : '0' + month;
		day = day > 9 ? day : '0' + day;

		return `${year}-${month}-${day}`;
	}

	export default {
		data() {
			return {
				show: false,
				token: '',
				formData: {
					company: '', //公司名称
					companyNum: '', //职位介绍
					datel: '', //
					date2: '', //
					delivery: false, //
					desc: '', //
					education: '', //学历
					endTime: '', //招聘有效期
					industry: '', //行业领域
					lxr: '', //联系人
					memberId: '', //会员ID
					phone: '', //联系电话
					post: '', //需求标题
					postInfo: '', //需求详细描述
					publishType: '', //
					region: '', //
					resource: '', //
					safe: '', //发布级别
					salary: '', //薪资待遇
					serverType: '', //服务形式
					type: [], //
					workPlace: '', //工作地点
					workYear: '', //工作经验
					xw: '', //学位
					zc: '', //职称
					zyfx: '', //专业方向
				},
				canlendarShow: false,
				//发布级别
				levelArray: [],
				//发布级别选中项
				levelIndex: 0,
				//服务形式
				servicetypeArray: [],
				//服务形式选中项
				servicetypeIndex: 0,
				//行业领域
				industryArray: [],
				//行业领域选中项
				industryIndex: 0,
				//工作经验
				workyearArray: [],
				//工作经验选中项
				workyearIndex: 0,
				//薪资报酬
				moneyArray: [],
				//薪资报酬选中项
				moneyIndex: 0,
				//有效期
				timelimitArray: [],
				//有效期选中项
				timelimitIndex: 0,


				//截止时间选择相关
				date: getDate({
					format: true
				}),
				startDate: getDate('start'),
				endDate: getDate('end'),
			}
		},
		onLoad() {
			this.formData.company = '陕西乐尚物联'
			this.getCityList();
			this.getUser()
		},
		methods: {
			getUser() {
				const value = uni.getStorageSync("userInfo") || []
				if (value.login_user == null) {
					uni.redirectTo({
						url: '/subpages/pages/register/login_province'
					})
					uni.showToast({
						icon: 'none',
						title: '请先登录！'
					})
				} else {
					this.token = value.access_token
					this.formData.memberId = value.login_user.member.id
					this.formData.company = value.login_user.member.corpName
				}

			},
			getCityList() {
				mydata.getDicts("wanted_safe").then((response) => {
					this.levelArray = response.data;
				});
				mydata.getDicts("bus_need_type").then((response) => {
					this.typeArray = response.data;
				});
				mydata.getDicts("cms_approve_status").then((response) => {
					this.statusList = response.data;
				});
				mydata.getDicts("bus_need_level").then((response) => {
					this.emergencyArray = response.data;
				});
				mydata.getDicts("bus_need_way").then((response) => {
					this.cooperationArray = response.data;
				});
				//招聘相关字典
				mydata.getDicts("wanted_time").then((response) => {
					this.timelimitArray = response.data;
				});
				mydata.getDicts("wanted_exp").then((response) => {
					this.workyearArray = response.data;
				});
				mydata.getDicts("wanted_type").then((response) => {
					this.servicetypeArray = response.data;
				});
				mydata.getDicts("wanted_industry").then((response) => {
					this.industryArray = response.data;
				});
				mydata.getDicts("wanted_safe").then((response) => {
					this.levelArray = response.data;
				});
				mydata.getDicts("cms_money").then((response) => {
					this.moneyArray = response.data;
				});
			},
			selectPics() {
				var that = this;
				uni.chooseImage({
					count: 3,
					success: (res) => {
						const files = res.tempFiles;
						let imgArr = [];
						for (let i = 0; i < files.length; i++) {
							let obj = new Object();
							obj.name = 'photo' + i;
							obj.uri = files[i].path;
							that.fileList.push(obj);
						}
					}
				})
			},
			submitNeeds() {
				this.formData.workYear = this.workyearArray[this.workyearIndex].dictValue
				this.formData.industry = this.industryArray[this.industryIndex].dictValue
				this.formData.salary = this.moneyArray[this.moneyIndex].dictValue
				this.formData.serverType = this.servicetypeArray[this.servicetypeIndex].dictValue
				this.formData.endTime = this.timelimitArray[this.timelimitIndex].dictValue
				this.formData.safe = this.levelArray[this.levelIndex].dictValue
				if (this.formData.post == '') {
					uni.showToast({
						icon: 'none',
						title: '需求名称不能为空！'
					})
				} else if (this.formData.company == '') {
					uni.showToast({
						icon: 'none',
						title: '招聘单位不能为空！'
					})
				} else if (this.formData.industry == '') {
					uni.showToast({
						icon: 'none',
						title: '行业领域不能为空！'
					})
				} else if (this.formData.workYear == '') {
					uni.showToast({
						icon: 'none',
						title: '工作经验不能为空！'
					})
				} else if (this.formData.education == '') {
					uni.showToast({
						icon: 'none',
						title: '学历不能为空！'
					})
				} else if (this.formData.salary == '') {
					uni.showToast({
						icon: 'none',
						title: '薪资报酬不能为空！'
					})
				} else if (this.formData.workPlace == '') {
					uni.showToast({
						icon: 'none',
						title: '工作地点不能为空！'
					})
				} else if (this.formData.lxr == '') {
					uni.showToast({
						icon: 'none',
						title: '联系人不能为空！'
					})
				} else if (this.formData.phone == '') {
					uni.showToast({
						icon: 'none',
						title: '联系电话不能为空！'
					})
				} else if (this.formData.companyNum == '') {
					uni.showToast({
						icon: 'none',
						title: '职位介绍不能为空！'
					})
				} else if (this.formData.postInfo == '') {
					uni.showToast({
						icon: 'none',
						title: '需求描述不能为空！'
					})
				} else {
					uni.showModal({
						title: '提示',
						content: '确认该招聘信息无误并提交吗？',
						showCancel: true,
						cancelText: '取消',
						confirmText: '提交',
						success: (res) => {
							if (res.confirm) {
								console.log('comfirm') //点击确定之后执行的代码
								needs.tanlentWanted(this.formData).then((res) => {
									uni.showToast({
										title: '提交成功！'
									})
									uni.navigateBack()
								})
							} else {
								console.log('cancel') //点击取消之后执行的代码
							}
						}
					})

				}
			},
			changeDate(e) {
				this.canlendarShow = false;
				var year = e.year
				var month = e.month
				if (month < 10) {
					month = "0" + month
				}
				var day = e.day
				if (day < 10) {
					day = "0" + month
				}

				this.formData.deadline = year + '-' + month + '-' + day
			},
			cooperationChange(e) {
				this.cooperationIndex = e.target.value;
				this.formData.hzfs = this.cooperationArray[this.cooperationIndex].dictValue;
			},
			typeChange(e) {
				this.typeIndex = e.target.value;
				this.formData.type = this.typeArray[this.typeIndex].dictValue;
			},
			cityChange(e) {
				this.cityIndex = e.target.value;
				this.formData.city = this.cityArray[this.cityIndex].dictValue;
			},
			bindDateChange(e) {
				this.formData.deadline = e.detail.value;
				this.date = e.detail.value;
			},
			emergencyChange(e) {
				this.emergencyIndex = e.target.value;
				this.formData.jjcd = this.typeArray[this.typeIndex].dictValue;
			},
			//招聘下拉框
			levelChange(e) {
				this.levelIndex = e.target.value;
			},
			industryChange(e) {
				this.industryIndex = e.target.value;
			},
			servicetypeChange(e) {
				this.servicetypeIndex = e.target.value;
			},
			workyearChange(e) {
				this.workyearIndex = e.target.value;
			},
			moneyChange(e) {
				this.moneyIndex = e.target.value;
			},
			timelimitChange(e) {
				this.timelimitIndex = e.target.value;
			}
		}
	}
</script>

<style>
	.content {
		height: 100%;
		background-color: #e5e5e5;
		padding-bottom: 20rpx;
	}

	.content span {
		color: darkred;
	}

	.uni-form-item {
		margin: 60rpx 30rpx;
		border-radius: 50px;
	}

	.uni-form-item button {
		background-color: #016fb8;
		height: 90rpx;
		font-size: 35rpx;
		margin-top: 50rpx;
	}

	.login_from_input {
		width: 100%;
		height: auto;
		display: flex;
		flex-direction: row;
		justify-content: space-between;
		align-items: center;
		border-bottom: 1px #eee solid;
		padding: 20upx 0px;
		margin: 0px auto;
		background-color: #fff;
	}

	.login_from_name {
		width: 30%;
		margin-left: 40rpx;
		font-size: 30rpx;
	}

	.login_from_fun {
		width: 70%;
		display: flex;
		flex-direction: row;
		justify-content: flex-end;
		text-align: right;
	}

	.login_from_fun input {
		width: 100%;
		text-align: left;
		font-size: 14px;
	}

	.detail {
		background-color: #fff;
		margin-top: 25rpx;
		height: 400rpx;
	}

	.form-left {
		margin-left: 16px;
		padding: 5rpx 0;
	}

	.form-right {
		margin-top: 6px;
		margin-left: 6px;
		padding: 5px 0;
		width: 90%;
		border: 1px solid #D8D8D8;
		border-radius: 3px;
	}

	.upLoadImg {
		width: 96rpx;
		height: 96rpx;
		background-color: #FFFFFF;
		margin-top: 16rpx;
		margin-left: 6px;
	}

	.devideline {
		float: left;
		height: 0.3rpx;
		width: 100%;
		background-color: #eeeeee;
		margin-top: 25rpx;
		margin-bottom: 15rpx;
	}

	textarea {
		margin-right: 20rpx;
		height: 300rpx;
		word-wrap: break-word;
		text-align: left;
		font-size: 15px;

	}
</style>